<template>
  <el-dialog
    :visible="show"
    :title="title"
    :before-close="close"
    width="fit-content"
    center
    :close-on-click-modal="false"
  >
    <el-form
      :model="dataForm"
      :rules="rules"
      :inline="true"
      ref="dataForm"
      label-width="130px"
    >
      <el-form-item prop="name" label="商户号名称">
        <el-input
          type="text"
          v-model="dataForm.name"
          placeholder="请输入商户号名称"
        ></el-input>
      </el-form-item>
      <el-form-item prop="isspId" label="翼码商户号">
        <el-input
          type="text"
          v-model="dataForm.isspId"
          clearable
          placeholder="请输入翼码商户号"
        ></el-input>
      </el-form-item>

      <el-form-item prop="systemId" label="平台号">
        <el-input
          type="text"
          v-model="dataForm.systemId"
          clearable
          placeholder="请输入平台号"
        ></el-input>
      </el-form-item>
      <el-form-item prop="systemKey" label="平台密钥">
        <el-input
          type="text"
          v-model="dataForm.systemKey"
          clearable
          placeholder="请输入平台密钥"
        ></el-input>
      </el-form-item>
      <el-form-item prop="posId" label="终端号">
        <el-input
          type="text"
          v-model="dataForm.posId"
          clearable
          placeholder="请输入终端号"
        ></el-input>
      </el-form-item>
      <el-form-item prop="remark" label="备注">
        <el-input type="textarea" v-model="dataForm.remark"></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer">
      <el-button type="primary" @click="submit">提交</el-button>
      <el-button @click="close">取消</el-button>
    </div>
  </el-dialog>
</template>

<script>
 import * as message from "@/constants/message";
 import YmMerchantApi from "@/api/account/ymMerchant"
 import TenantApi from "@/api/system/tenant"
export default {
  name:"AddYmMerchant",
  props: ["show","id"],
  data() {
    return {
      dataForm: {
        name: "",
        isspId: "",
        systemId: "",
        systemKey:"",
        posId:"",
        remark: "",
      },
      title:"新增翼码商户号",
      tenantList:[],
      rules: {
        name: [
              {required: true, message: "请输入商户号", trigger: "focus"}
            ],
            isspId:[
              {required:true,message:"请输入翼码商户号",trigger:"focus"}
            ],
            systemId: [
              {required: true, message: "请输入平台号", trigger: "focus"}
            ],
            systemKey: [
              {required: true, message: "请输入平台密钥", trigger: "focus"}
            ],
            posId: [
              {required: true, message: "请输入终端号", trigger: "focus"}
            ],
      },
    };
  },
  watch: {
    async show(val) {
      if(!val)return
      if(this.id){
        this.title = "编辑翼码商户号"
        this.getData()
      }else{
        this.title = "新增翼码商户号"
      }
    }
  },
  mounted() {
    this.getTenantList()
  },
  methods: {
    async getData(){
      const {data} = await YmMerchantApi.getYmMerchant({id:this.id})
      this.$Utils.bindingBean(this.dataForm,data)
    },
    async getTenantList(){
      const {data} = await TenantApi.listIdName()
      this.tenantList = data
    },
    async submit() {
      await this.$refs.dataForm.validate()
      await this.$confirm(message.MSG_CONFIRM_SAVE_ALTER, message.TITLE_PROMPT, {})
      const {dataForm,id} = this
      const params = {...dataForm}
      if (id) {
        params.id = id
        await YmMerchantApi.editYmMerchant(params)
      } else {
        await YmMerchantApi.addYmMerchant(params)
      }
      this.$emit("confirm")
      this.close()
      this.$Utils.notifySuccess()
    },
    close() {
      Object.assign(this.$data.dataForm, this.$options.data().dataForm)
      this.$emit("update:show", false);
    }
  }
};
</script>

<style lang="scss" scoped>
@import "@/assets/css/views/dialogAdd.scss";
</style>
